<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<!-- 引入样式 -->
		<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
	</head>
	<body>
		<div id="app">
			  <el-table :data="tableData" stripe style="width: 100%">
				<el-table-column
				  prop="date"
				  label="日期"
				  width="180">
				</el-table-column>
				<el-table-column
				  prop="name"
				  label="姓名"
				  width="180">
				</el-table-column>
				<el-table-column
				  prop="address"
				  label="地址">
				</el-table-column>
			  </el-table>
		</div>
		
	</body>
	<script src="https://unpkg.com/vue/dist/vue.js"></script>
	<!-- 引入组件库 -->
	<script src="https://unpkg.com/element-ui/lib/index.js"></script>
	<script>
		new Vue({
			el:'#app',
			data: {
			    tableData: [
					{
						date: '2016-05-02',
						name: '王小虎',
						address: '上海市普陀区金沙江路 1518 弄'
					}, 
					{
						date: '2016-05-04',
						name: '王小虎',
						address: '上海市普陀区金沙江路 1517 弄'
					}, 
					{
						date: '2016-05-01',
						name: '王小虎',
						address: '上海市普陀区金沙江路 1519 弄'
					}, 
					{
						date: '2016-05-03',
						name: '王小虎',
						address: '上海市普陀区金沙江路 1516 弄'
					},
				]
			}
		})
	</script>
</html>
